import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
import Home from '../views/Home.vue'

const routes: Array<RouteRecordRaw> = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  /**
   * 组件示例
   */
  {
    path: '/css',
    name: 'Css',
    component: () => import(/* webpackChunkName: "css" */ '../views/components/css/index.vue')
  },
  {
    path: '/row',
    name: 'Row',
    component: () => import(/* webpackChunkName: "css" */ '../views/components/row/index.vue')
  },
  {
    path: '/directive',
    name: 'Directive',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/directive/index.vue')
  },
  {
    path: '/dropdown-button',
    name: 'DropdownButton',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/dropdown-button/index.vue')
  },
  {
    path: '/matrix',
    name: 'Matrix',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/matrix/index.vue')
  },
  {
    path: '/message',
    name: 'Message',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/message/index.vue')
  },
  {
    path: '/card',
    name: 'Card',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/card/index.vue')
  },
  {
    path: '/folding-panel',
    name: 'FoldingPanel',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/folding-panel/index.vue')
  },
  {
    path: '/radio-and-checkbox',
    name: ' RadioAndCheckbox',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/radio-and-checkbox/index.vue')
  },
  {
    path: '/dialog',
    name: ' Dialog',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/dialog/index.vue')
  },
  {
    path: '/tabs',
    name: ' Tabs',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/tabs/index.vue')
  },
  {
    path: '/content-panel',
    name: 'ContentPanel',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/content-panel/index.vue')
  },
  {
    path: '/panel-position',
    name: 'PanelPosition',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/panel-position/index.vue')
  },
  
  {
    path: '/search-panel',
    name: 'SearchPanel',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/search-panel/index.vue')
  },
  {
    path: '/tree-select',
    name: 'TreeSelect',
    component: () => import(/* webpackChunkName: "thousands" */ '../views/components/tree-select/index.vue')
  },
  {
    path: '/table',
    name: 'Table',
    component: () => import(/* webpackChunkName: "tree-table" */ '../views/components/table/index.vue')
  },
  {
    path: '/tree-table',
    name: 'TreeTable',
    component: () => import(/* webpackChunkName: "tree-table" */ '../views/components/tree-table/index.vue')
  },

/**
 * 页面模板
 */
//  {
//   path: '/common-second-page-template',
//   name: 'CommonSecondPageTemplate',
 
// },
]

const router = createRouter({
  history: createWebHashHistory(),
  routes
})

export default router
